<template>
  <div class="pchome">
    <div class="pc_title">客户招揽任务中心</div>
    <!-- <div class="pc_content">
      <div class="con_left">
        <TaskList></TaskList>
      </div>
      <div class="con_right">
        <div class="con_top flexbox">
          <UserInfo class="aa"></UserInfo>
          <CarBasicInfo class="bb"></CarBasicInfo>
        </div>
        <div class="taskDetail">
          <TaskDetail></TaskDetail>
        </div>
        <div class="con_record flexbox">
          <FollowRecord></FollowRecord>
        </div>
      </div>
    </div> -->
    <van-row>
      <van-col span="8">
        <TaskList @getDetail="getDetail"></TaskList>
      </van-col>
      <van-col span="16">
        <CarDetail :detailId="detailId"></CarDetail>
        <!-- <van-row>
          <van-col span="12">

            <UserInfo :detailId="detailId"></UserInfo>
          </van-col>
          <van-col span="12">
            <CarBasicInfo :carId="carId"></CarBasicInfo>
          </van-col>
        </van-row>
        <van-row>
          <van-col span="24">
            <TaskDetail :detailId="detailId"></TaskDetail>
          </van-col>
        </van-row>
        <van-row>
          <van-col span="12">
            <FollowRecord :detailId="detailId"></FollowRecord>
          </van-col>
        </van-row> -->
      </van-col>
    </van-row>
  </div>
</template>

<script>
import TaskList from './components/taskList'
import UserInfo from './components/userInfo'
import CarBasicInfo from './components/carBasicInfo'
import TaskDetail from './components/taskDetail'
import FollowRecord from './components/followRecord'
import { Col, Row } from 'vant'
import CarDetail from './components/carDetail'
export default {
  name: 'repairOrder',
  components: {
    TaskList,
    UserInfo,
    CarBasicInfo,
    TaskDetail,
    FollowRecord,
    Col,
    Row,
    CarDetail,
  },
  data() {
    return { taskData: {}, detailId: '', carId: '' }
  },

  mounted() {},

  methods: {
    getDetail(taskData) {
      this.taskData = taskData
      this.detailId = taskData.billId
      this.carId = taskData.billId
    },
  },
}
</script>
<style scoped>
body {
  font-size: 50px !important;
}
</style>
<style lang="less">
.pchome {
  width: 100%;
}
.pc_title {
  font-size: 0.4rem;
  font-weight: bold;
  width: 100%;
  height: 1rem;
  line-height: 1.2rem;
  padding-left: 0.5rem;
}
.flexbox {
  display: flex;
}
.pc_content {
  width: 100%;
  position: relative;
  height: calc(100vh - 1.2rem);
  box-sizing: border-box;
  display: flex;
  border: 1px solid #000;
  background: #f3f3f3;
  .con_left {
    // position: absolute;
    width: 7.5rem;
    // left: 0;
    position: relative;
    border: 1px solid #000;
  }
  .con_right {
    border: 1px solid #000;
    background: #f6f6f6;
    padding-top: 0.2rem;
    padding-left: 0.2rem;
    height: calc(100vh - 1rem);
    width: 100%;
    .con_top {
      margin-bottom: 0.3rem;
      width: 100%;
    }
    .con_record {
      height: 5rem;
      width: 100%;
      margin-bottom: 0.3rem;
    }
  }
}
.taskDetail {
  width: 7.5rem;
}
.aa {
  width: 50%;
}
.bb {
  width: 50%;
}
</style>
